<template>
  <div>
    <el-calendar>
      <template #date-cell="{ data }">
        <!-- <p :class="data.isSelected ? 'is-selected' : ''">
          {{ data.day.split("-").slice(1).join("-") }}
          {{ data.isSelected ? "✔️" : "" }}
        </p> -->
        <div
          class="dateContainer"
          :class="data.isSelected ? 'is-selected' : ''"
        >
          <div
            style="
              display: flex;
              flex-direction: row;
              justify-content: space-around;
            "
          >
            <div class="dateContainer-top">
              {{ data.day.split("-").slice(1).join("-") }}
            </div>
            <div class="dateContainer-btn">
              <el-icon :color="data.isSelected ? '#409EFC' : ''"
                ><EditPen
              /></el-icon>
            </div>
          </div>
          <div>
            <!-- {{ data.isSelected ? "✔️" : "" }} -->
            <el-icon :color="data.isSelected ? '#409EFC' : ''"
              ><Delete
            /></el-icon>
          </div>
        </div>
      </template>
    </el-calendar>
  </div>
</template>
<script lang="ts" setup>
import { ref, inject, onMounted, reactive, onBeforeUnmount } from "vue";
import useCurrentInstance from "@/utils/useCurrentInstance";
import CalendarForm from "./components/calendarForm.vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { ElNotification } from "element-plus"; //处理导航信息

const { proxy } = useCurrentInstance();
const equipClassType = inject("equipClassType") as any; //设备排班
const equipClass = inject("equipClass") as any; //设备排班记录

//查询设备排班记录
proxy.eventBus.on("getScheduleOfEquip", (res: any) => {
  console.log("查询设备排班记录", res);
  equipClassType
    .getScheduleRecord({ equipmentCode: res.equipmentCode })
    .then((res: any) => {});
});
</script>
<style lang="scss" scoped></style>
